<template>
  <div class="page admin">
    <el-card class="box-card">
       <el-form :model="form" label-width="80px">
           <el-col :span='6'>
               <el-form-item label="申报账号">
                <el-input size="mini" v-model="form.account"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='6'>
               <el-form-item label="学校">
                <el-input size="mini" v-model="form.school"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='6'>
               <el-form-item label="所在区">
                <el-input size="mini" v-model="form.area"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='4'>
               <el-form-item label="姓名">
                <el-input size="mini" v-model="form.name"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='4'>
               <el-form-item label="申报状态">
               <el-select  size="mini" v-model="form.state" placeholder="请选择">
                    <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
              </el-form-item>
           </el-col>
           <el-col :span='4' class="center">
               <el-button @click="get" type="primary" size="mini">搜索</el-button>
               <el-button @click="exportE(1)" type="primary" size="mini">导出</el-button>
               <el-button @click="exportE(2)" type="primary" size="mini">批量导出</el-button>
           </el-col>

           

       </el-form>
       <el-dialog
          :title="exportTitle"
          :visible.sync="dialogVisible"
          width="30%"
          >
          <div>
            <div style="margin: 10px 0;"><span style="width:80px;display:inline-block;text-align:right;">手机号码：</span><el-input v-model="mobile" style="width:50%" size="mini"></el-input></div>
            <div style="margin: 10px 0;"><span style="width:80px;display:inline-block;text-align:right;">验证码：</span><el-input v-model="code" style="width:50%" size="mini"></el-input></div>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button size="mini" @click="dialogVisible = false">取 消</el-button>
            <el-button size="mini" type="primary" @click="batchExport(exportType)">导 出</el-button>
          </span>
        </el-dialog>
        <el-table
          ref="multipleTable"
          :data="tableData3"
          tooltip-effect="dark"
          style="width: 100%"
          border
          highlight-current-row
          @current-change="selectChange"
          >
         
          <el-table-column
            label="申报帐号"
            width="120"
            prop="username">
            <!-- <template slot-scope="scope">{{ scope.row.date }}</template> -->
          </el-table-column>
          <el-table-column
            prop="project_title"
            label="项目名称"
            width="120">
          </el-table-column>
          <el-table-column
            prop="subject"
            label="学科"
            width="120">
          </el-table-column>
          <el-table-column
            prop="school_name"
            label="申报单位"
            >
          </el-table-column>
          <el-table-column
            prop="school_address"
            label="所在区"
            >
          </el-table-column>
          <el-table-column
            prop="student_name"
            label="姓名"
            >
          </el-table-column>
          <el-table-column
            prop="review"
            label="申报状态"
            >
          </el-table-column>
          <el-table-column
            prop="review_user"
            label="项目审核人"
            width="120px"
            >
          </el-table-column>
          <el-table-column
            prop="number"
            label="评审得分1"
            width="120px"
            >
          </el-table-column>
          <el-table-column
            prop="number1"
            label="评审得分2"
            width="120px"
            >
          </el-table-column>
          <el-table-column
            prop="number2"
            label="评审得分3"
            width="120px"
            >
          </el-table-column>
          <el-table-column
            prop="number2"
            label="申报信息"
            width="120px"
            >
            <template slot-scope="scope">
               <el-button type="text" @click="showinfobox(scope.row)">查看项目信息</el-button>
            </template>
          </el-table-column>          
        </el-table>
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage1"
          :page-size="10"
          layout="total, prev, pager, next"
          :total="total">
        </el-pagination>

        <el-dialog
        title="项目信息"
        :visible.sync="showinfo"
        width="60%"
        >
          <div>
            <small>提示：如果无法查看PDF，请确认是否被浏览器拦截。</small>
          </div>
          <div class="box" v-for="(i,index) in item" :key="index">

            <h3>{{i.name}}</h3>
            <el-button type="text" @click="booklook(i.number)">预览PDF</el-button>
              
          </div>
          <div class="bxo">
            <h3>论文</h3>
            <el-button type="text" @click="booklook(7)">下载</el-button>
          </div>
        </el-dialog>
        <!-- <c-pdf @closepdf="closepdf" :show='isshowpdf' v-show="isshowpdf" :pdfurl="testpdfurl"></c-pdf> -->
    </el-card>
    
  </div>
</template>

<script type="text/ecmascript-6">
import $ from "jquery";
import CPdf from "../../shenhe/CPdf";
export default {
  data() {
    return {
      exportTitle: null,
      exportType: null,
      total: null,
      selectid: null,
      currentPage1: 1,
      dialogVisible: false,
      innerVisible: false,
      showinfo: false,
      book1: null,
      book2: null,
      book3: null,
      book4: null,
      book5: null,
      book6: null,
      testpdfurl: "",
      api: process.env.API_ROOT,
      isshowpdf: false,
      mobile: null,
      code: null,
      item: [
        {
          name: "作者信息",
          number: 1
        },
        {
          name: "研究项目",
          number: 2
        },
        {
          name: "个人陈述",
          number: 3
        },
        {
          name: "辅导教师",
          number: 4
        },
        {
          name: "学习成绩",
          number: 5
        },
        {
          name: "指导专家",
          number: 6
        }
      ],
      tableData3: [],
      form: {
        account: "",
        school: "",
        area: "",
        name: "",
        state: ""
      },
      options: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 4,
          label: "未提交"
        },
        {
          value: 1,
          label: "待审核"
        },
        {
          value: 2,
          label: "审核通过"
        },
        {
          value: 3,
          label: "审核不通过"
        },
        {
          value: 5,
          label: "评审完成"
        }
      ],
      page: 1
    };
  },
  components: {
    CPdf
  },
  mounted() {
    this.get();
  },
  methods: {
    isEmpty(obj) {
      if (typeof obj == "string") return true;
      for (var i in obj) {
        return false;
      }
      return true;
    },
    buildUri(obj) {
      console.log(obj, 123);
      var uri = "";
      for (var index in obj) {
        if (this.isEmpty(obj[index])) {
          uri += index + "=" + obj[index] + "&";
        } else {
          uri += buildUri(obj[index]);
        }
      }
      return uri;
    },
    exportE(val) {
      this.exportType = val;
      if (val === 1) {
        if (this.selectid === null) {
          this.$message.error("请选择一条记录");
          return;
        }
        this.exportTitle = "导出";
        this.exportType = 1;
      } else {
        this.exportTitle = "批量导出";
        this.exportType = 2;
      }
      this.dialogVisible = true;
    },
    batchExport(val) {
      let data = this.form;
      let da = {
        mobile: this.mobile,
        code: this.code
      };
      this.$http
        .get(
          `/filing/manager/list/checkfsj?mobile=${this.mobile}&code=${
            this.code
          }`
        )
        .then(res => {
          if (res.data.success === false) {
            this.$message.error(res.data.msg);
            return;
          } else {
            switch (val) {
              // 导出
              case 1:
                // this.$http.get("/filing/manager/list/export", {
                //   params: data
                // });
                data.userId = this.selectid;
                let url =
                  this.api +
                  "/filing/manager/list/export" +
                  `?${this.buildUri(data)}`;
                console.log(url);
                window.open(url);
                break;
              // 批量导出
              case 2:
                let urls =
                  this.api +
                  "/filing/manager/list/export" +
                  `?${this.buildUri(data)}`;
                // this.$http.get("/filing/manager/list/export", {
                //   params: data
                // });
                window.open(urls);
                break;

              default:
                break;
            }
            this.mobile = null;
            this.code = null;
            this.dialogVisible = false;
            this.form = {
              account: "",
              school: "",
              area: "",
              name: "",
            };
            this.selectid = null;
          }
        });

      // if(this.phone === null) {
      //   this.$message.error('请填写手机号')
      //   return false
      // }
      // if(this.code === null) {
      //   this.$message.error('请填写验证码')
      //   return false
      // }
    },
    closepdf() {
      this.isshowpdf = false;
    },
    booklook(val) {
      switch (val) {
        case 1:
          if (this.book1 === null) {
            this.$message.error("暂无内容");
            return;
          }

          this.testpdfurl = this.api + "/pdf" + this.book1;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });

          break;
        case 2:
          if (this.book2 === null) {
            this.$message.error("暂无内容");
            return;
          }
          this.testpdfurl = this.api + "/pdf" + this.book2;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });

          break;
        case 3:
          if (this.book3 === null) {
            this.$message.error("暂无内容");
            return;
          }

          this.testpdfurl = this.api + "/pdf" + this.book3;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });
          break;
        case 4:
          if (this.book4 === null) {
            this.$message.error("暂无内容");
            return;
          }

          this.testpdfurl = this.api + "/pdf" + this.book4;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });
          break;
        case 5:
          if (this.book5 === null) {
            this.$message.error("暂无内容");
            return;
          }

          this.testpdfurl = this.api + "/pdf" + this.book5;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });
          break;
        case 6:
          if (this.book6 === null) {
            this.$message.error("暂无内容");
            return;
          }

          this.testpdfurl = this.api + "/pdf" + this.book6;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });
          break;
        case 7:
          if (this.wordpdf === "") {
            this.$message.error("暂无内容");
            return;
          }

          this.testpdfurl = this.api + "/pdf" + this.wordpdf;
          this.$http.get(`${this.testpdfurl}`).then(res => {
            console.log(res);
          });
          break;
        default:
          break;
      }
      this.isshowpdf = true;
    },
    showinfobox(val) {
      this.showinfo = true;
      this.$http.get(`/filing/project_subject/${val.user_id}`).then(res => {
        console.log(res, "123");
        this.wordpdf = res.data.data_submit1;
      });
      this.$http
        .get("/filing/book/find/userId", {
          params: {
            userId: val.user_id
          }
        })
        .then(res => {
          console.log(res);
          this.book1 = res.data.data.book1;
          this.book2 = res.data.data.book2;
          this.book3 = res.data.data.book3;
          this.book4 = res.data.data.book4;
          this.book5 = res.data.data.book5;
          this.book6 = res.data.data.book6;
        });
    },
    handleSizeChange(val) {
      this.page = val;
      this.get();
    },
    selectChange(val) {
      console.log(val);
      this.selectid = val.user_id;
    },
    handleCurrentChange(val) {
      this.page = val;
      this.get();
    },
    get() {
      let page = this.page;
      let data = this.form;
      this.$http
        .get(`/filing/manager/list/${page}`, {
          params: data
        })
        .then(res => {
          this.tableData3 = res.data.data.map((item, index) => {
            //  审核状态
            switch (item.review) {
              case 0:
                item.review = "已提交";
                break;
              case 1:
                item.review = "待审核";
                break;
              case 2:
                item.review = "审核通过";
                break;
              case 3:
                item.review = "审核不通过";
                break;
              case null:
                item.review = "未提交";
                break;
              default:
                break;
            }

            if(item.sump === 3 ) {
              item.review = "已完成"
            }
            // 评审分数
            let lengths = item.score.length;
            item.number = "-";
            item.number1 = "-";
            item.number2 = "-";
            switch (lengths) {
              case 1:
                item.number = item.score[0].zf;
                break;
              case 2:
                item.number = item.score[0].zf;
                item.number1 = item.score[1].zf;
                break;
              case 3:
                item.number = item.score[0].zf;
                item.number1 = item.score[1].zf;
                item.number2 = item.score[2].zf;
                break;

              default:
                break;
            }
            return item;
          });
          this.total = res.data.total;
        });
    },
    show() {
      this.show = ture;
    },
    toggleSelection(rows) {
      if (rows) {
        rows.forEach(row => {
          this.$refs.multipleTable.toggleRowSelection(row);
        });
      } else {
        this.$refs.multipleTable.clearSelection();
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    }
  }
};
</script>

<style scoped lang="scss">
@import "./index.scss";
.box {
  width: 100px;
  display: inline-block;
}
</style>
